<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

        
        <link rel="stylesheet" type="text/css" media="screen" href="media/css/themes/redmond/jquery-ui-1.8.21.custom.css" />
        
        <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
        <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>       
        <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>


        <script src="js/i18n/grid.locale-es.js" type="text/javascript"></script>
        <script type="text/javascript">
            $.jgrid.no_legacy_api = true;
            $.jgrid.useJSON = true;
        </script>
        <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<!--        <script src="js/jquery.tablednd.js" type="text/javascript"></script>
        <script src="js/jquery.contextmenu.js" type="text/javascript"></script>
        <script src="js/ui.multiselect.js" type="text/javascript"></script>    -->
        
        <script type="text/javascript">     
            $(document).ready(function()
{
    

    

    var lastsel3; 
    jQuery("#tblDetallePedido").jqGrid({ 
        url:'php/GetDetallePedido.php?packing=5&page=1&rows=5', 
        datatype: "json",
        height: 120,
        autowidth: true,
        colNames:['id','Marca','Tipo Caja','Caja','Producto','Variedad','Largo','Bodega','Tallos/Bunche',
                    'Bunches/Caja','Tallos','Precio(fob)','Precio(cif)','Total(fob)','Total(cif)'
                ], 
        colModel:[ 
            {name:'prep_id',index:'prep_id', width:90, sorttype:"int", hidden: true}, 
            {name:'marca',index:'marca', width:90, sorttype:"int", editable: true}, 
            {name:'tipo_caja',index:'tipo_caja',width:90, editable:true, sorttype:"date"}, 
            {name:'caja',index:'caja', width:100,editable: true,editoptions:{size:"20",maxlength:"30"}}, 
            {name:'producto',index:'producto', width:60, editable: true,edittype:"checkbox",editoptions: {value:"Yes:No"}}, 
            {name:'variedad',index:'variedad', width:90, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX"}}, 
            {name:'longitud',index:'longitud', width:100, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}},
            {name:'bodega',index:'bodega', width:100, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}}, 
            {name:'tallosBunche',index:'tallosBunche', width:100, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}},
            {name:'bunchesCaja',index:'bunchesCaja', width:100, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}},
            {name:'tallos',index:'tallos', width:50}, 
            {name:'precioFob',index:'precioFob', width:50}, 
            {name:'precioCif',index:'precioCif', width:50}, 
            {name:'totalFob',index:'totalFob', width:50},
            {name:'totalCif',index:'totalCif', width:50}
            
            
            
        ],
        rowNum:5, 
        rowList:[5,10,20,30], pager: '#pager',
        viewrecords: true,
        
        
        caption: "Date Picker Integration" 
    }
    ); 
    
    
    
    
    $(window).bind('resize', function() {
    $('#tblDetallePedido').setGridWidth($(getSelectedTabHref()).width());
    $('#tblDetallePedido').setGridHeight($(window).height()-190);
    }).trigger('resize');
     
    
        
});        
        </script>
        <title></title>
    </head>
    <body>
        
        <table id="tblDetallePedido"></table>
        <div id="pager"></div>
        
     
        <?php
        // put your code here
        ?>
    </body>
</html>
